<template>
	<view class="container">
		<view class="recharge">
			<view>
				选择提现的银行卡
			</view>
			<view class="choose_account">			
				<view>
					<image src="../../static/icon/yinhangka.png"></image>
				</view>			
				<view>
					<picker @change="bindPickerChange" :value="index" :range="array">
						<view>{{array[index]}}</view>
					</picker>
				</view>			
			</view>
			<view>
				<input type="number" placeholder="输入提现金额" class="amount" v-model="amount">
			</view>
		</view>
		<view>
			<button type="primary" @click="cash">提现</button>
		</view>
	</view>
</template>

<script>
	import Global from '../../common/global.js'
	
	export default {
		data() {
			return {
				customerNumber:'',
				array:[],
				typeArray:[],
				index:0,
				amount:''
			}
		},
		methods: {
			//获得绑卡列表
			getAccountList() {
				uni.request({
					url: Global.BASE_URL + '/ewallet/queryBindAccountByCustomer',
					header:{
						'content-type': 'application/x-www-form-urlencoded'
					},
					data:{
						customerNumber:this.customerNumber
					},
					method:'POST',
					success:(res)=>{ //注意使用箭头函数						
						this.array = res.data.map((item)=>{
							return item.accountNumber
						});	
						
						this.typeArray = res.data.map((item)=>{
							return item.accountType
						});
					},
					fail(err) {
						uni.showToast({
							title:'查询绑卡列表接口调用失败',
							icon:'none'
						})
					}
				})	
			},
			// 选择框事件
			bindPickerChange: function(e) {
			    console.log('picker发送选择改变，携带值为', e.target.value)
			    this.index = e.target.value
			},
			//提现操作
			cash(){
				uni.showModal({
					title: '提取现金提示',
					content: '确认账户' + this.array[this.index] + '提现' + this.amount + '?' ,
					success: (res)=> {
						if (res.confirm) {
							
							new Promise((resolve, reject) => {
								
								//进行当前钱包余额校验
								uni.request({
									url: Global.BASE_URL + '/ewallet/queryCustomer',
									header:{
										'content-type': 'application/x-www-form-urlencoded'
									},
									data:{
										customerNumber:this.customerNumber										
									},
									method:'POST',
									success:(res)=>{ //注意使用箭头函数						
										if (res.data.balance >= this.amount) {
											resolve(res);
										} else {
											reject("钱包余额不足，请先充值");
										}
									},
									fail(err) {
										uni.showToast({
											title:'查询客户接口调用失败',
											icon:'none'
										})
									}
								})	
							})							
							.then(data => {
								
								uni.request({
									url: Global.BASE_URL + '/ewallet/cash',
									header:{
										'content-type': 'application/x-www-form-urlencoded'
									},
									data:{
										customerNumber:this.customerNumber,
										accountNumber:this.array[this.index],
										accountType:this.typeArray[this.index],
										amount:this.amount
									},
									method:'POST',
									success:(res)=>{ //注意使用箭头函数						
										uni.showToast({
											title:'提现成功',
											duration: 1000
										})
										
										setTimeout(()=>{
											uni.switchTab({
												url:'../home/home'
											})
										},1000);
									},
									fail(err) {
										uni.showToast({
											title:'提现接口调用失败',
											icon:'none'
										})
									}
								})
								
							})
							.catch(err => {
								uni.showToast({
									title:err,
									icon:'none'
								})
							})
							
						} 
					}
				});					
			}
		},
		onLoad() {
			//读取出客户编号
			this.customerNumber = uni.getStorageSync('customerNumber')
			//获得绑卡列表
			this.getAccountList()
		}
	}
</script>

<style>
	.container {		
		padding: 15rpx;
	}
	
	.recharge {
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
	}
	
	.choose_account {
		font-size: 40rpx;
		display: flex;
		justify-content:space-around;
		margin-top: 20rpx;
		margin-bottom: 20rpx;
	}

	.choose_account image {
		width: 50rpx;
		height: 50rpx;
	}
	
	.amount {
		width: 600rpx;
		height: 150rpx;
		color: #333333;
		font-size: 48rpx;
		border-bottom: 1px solid #C0C0C0;
		margin-bottom: 50rpx;
	}
</style>